
@import 'css/config.scss';
// Styles
.type-selection {
    height: 100%;
    padding-top: 24px;
    .type-selection-title {
        font-family: Roboto;
        font-size: 14px;
        font-weight: 500;
        line-height: 20px;
        color: #fff;
        margin-bottom: 8px;
    }
    
    .type-tabs {
        display: flex;
        .type-tab {
            flex: 1;
            color: #989898;
            cursor: pointer;
            transition: all 0.3s;
            background: #101011;
            height: 40px;
            margin-bottom: 20px;
            &:hover,&.active {
                background-color: $primary-color;
                color: #fff;
            }
            &:not(:last-child) {
                margin-right: 8px;
            }
        }
    }

    
    .type-footer {
        margin-top: 40px;
       

        .generate-button {
            width: 100%;
            // background: $primary-color;
            background: linear-gradient(139deg, #3F00FF 61%, #56E3FF 98%);
            color: #fff;
            width: 260px;
            height: 40px;
            cursor: pointer;
            transition: all 0.3s ease;
            border-radius: 8px;
            svg {
                margin-right: 8px;
                g path {
                     transition: all 0.3s ease;
                }
                
            }
            &:hover {
                // background-color: $primary-hover-color;
                background: linear-gradient(139deg, #3F00FF 61%, #56E3FF 98%);

                
            }

            &:active {
                // background: #4214CC;
                background: linear-gradient(139deg, #3F00FF 61%, #56E3FF 98%);

            }
           

            &:disabled {
                background: $disabled-color;
                color: $disabled-text-color;
                cursor: not-allowed;
                svg g path {
                    fill: $disabled-text-color;
                }
            }
        }
    }

    .type-content {
        // max-height: calc(100% - 200px);
        height: calc(100% - 110px);
        overflow: scroll;
    }
} 